<template>
    <div class="content_show">
        <div class="image_body">
            <img :src="myObject.activityCover ? myObject.activityCover : './images/轮播1.png'" />
        </div>
        <div class="infor_body">
            <div class="title_title">{{ myObject.activityName ? myObject.activityName : '河南康养医疗类专场双选会' }}</div>
            <div class="infor">
                <div class="infor_item1">
                    <div class="top">联系人</div>
                    <div class="item">{{ myObject.contactPerson ? myObject.contactPerson : '吴老师' }}</div>
                </div>
                <div class="infor_item2">
                    <div class="top">{{ myObject.contactPhone ? myObject.contactPhone : '1806179123' }}</div>
                    <div class="item">{{ myObject.email ? myObject.email : '1806179123@123.com' }}</div>
                </div>
            </div>
        </div>
        <div class="code_info">
            <div class="item_left">
                <div class="top">{{ myObject.unitName ? myObject.unitName : '浙江国邦药业有限公司邦药业有限公司' }}</div>
                <div class="item">签到时间：{{ myObject.signInTime ? myObject.signInTime : '2024-01-16 11：30' }}</div>
            </div>
            <div class="item_right">
                <div class="top">{{ myObject.boothNumber ? myObject.boothNumber : 1 }}</div>
                <div class="item">展位号</div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {};
    },
    props: ['myObject']
};
</script>
<style lang="less" scoped>
.content_show {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: start;
    align-items: center;
    overflow: hidden;
    background-color: #ffffff;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    flex-direction: column;

    .image_body {
        width: 100%;
    }

    .image_body > img {
        width: 100%;
    }

    .infor_body {
        width: 95%;
        margin: 0 auto;
        padding: 10px 0px;
    }

    .title_title {
        font-size: 100px;
        font-weight: 600;
    }

    .infor {
        width: 100%;
        display: flex;
        padding: 100px 0px;
        border-bottom: 5px dotted rgba(0, 0, 0, 0.2);

        .infor_item1 {
            flex: 2;
            border-right: 5px solid rgba(0, 0, 0, 0.2);

            .top {
                color: rgba(0, 0, 0, 0.5);
                font-size: 75px;
            }

            .item {
                font-size: 75px;
            }
        }

        .infor_item2 {
            flex: 4;
            padding-left: 100px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;

            .top {
                font-size: 75px;
                color: rgba(0, 0, 0, 0.5);
            }

            .item {
                font-size: 75px;
            }
        }
    }

    .code_info {
        width: 95%;
        margin: 0 auto;
        display: flex;
        padding: 50px 0px;

        .item_left {
            text-align: left;
            flex: 3;
            display: flex;
            flex-direction: column;
            justify-content: space-between;

            .top {
                font-size: 100px;
                font-weight: 600;
            }

            .item {
                font-size: 75px;
                color: rgba(0, 0, 0, 0.5);
            }
        }

        .item_right {
            text-align: right;
            flex: 2;
            display: flex;
            flex-direction: column;
            justify-content: space-between;

            .top {
                font-size: 160px;
                font-weight: 600;
                color: #1677ff;
            }

            .item {
                font-size: 75px;
                color: rgba(0, 0, 0, 0.5);
            }
        }
    }
}
</style>
